import React from 'react';
import ReactDOM from 'react-dom';

import { HashRouter as Router, Route, Switch, Redirect } from 'react-router-dom'

import { Provider } from 'mobx-react';

import { Tools, Toast, Bubble } from 'weaver-mobile';

import { FloatingTouch } from 'weaver-mobile-page';

import fnaAllStore from './stores';

import { asyncComponent } from 'react-async-component';
import FastClick from 'fastclick';
import {getEquipment} from './util/common';

import './style';

const coms = {
    Main: asyncComponent({  //主页
        resolve: () => import("./components/Main")
    }),
    Home: asyncComponent({  //首页
        resolve: () => import("./components/home") 
    }), 
    Apply: asyncComponent({  //申请
        resolve: () => import("./components/apply") 
    }),
    Statistical: asyncComponent({  //统计
        resolve: () => import("./components/statistical") 
    }),
    Application: asyncComponent({  //应用
        resolve: () => import("./components/application") 
    }),
    Remember: asyncComponent({  //记一笔 类型
        resolve: () => import("./components/remember") 
    }), 
    RememberDetailPage: asyncComponent({  //记一笔 详情
        resolve: () => import("./components/remember/RememberDetailPage") 
    }), 
    Reception: asyncComponent({  //发票录入
        resolve: () => import("./components/reception") 
    }),     
    AccountBook: asyncComponent({  //记账本
        resolve: () => import("./components/accountBook") 
    }), 
    Wallet: asyncComponent({  //我的票夹
        resolve: () => import("./components/wallet") 
    }), 
    ToWallet: asyncComponent({  //我的票夹
        resolve: () => import("./components/wallet/ToWallet") 
    }),
    ToWalletCloud: asyncComponent({  //我的票夹
        resolve: () => import("./components/wallet/toWalletCloud") 
    }),
    Ocr: asyncComponent({  //Ocr 二维码 手动识别
        resolve: () => import("./components/reception/Ocr") 
    }), 
    AddApplication: asyncComponent({  //三方 AddApplication
        resolve: () => import("./components/more/AddApplication") 
    }), 
    InvoiceAssistant: asyncComponent({  //开票助手
        resolve: () => import("./components/application/InvoiceAssistant") 
    }), 
    DetailPage: asyncComponent({  //我的票夹 发票详情
        resolve: () => import("./components/wallet/DetailPage") 
    }), 
    ToDetailPage: asyncComponent({  //流程跳转发票详情 
        resolve: () => import("./components/workflowToFna/ToDetailPage") 
    }),     
    
    
}




class Root extends React.Component {
    constructor(props){
        super(props);
        this.state = {
            emData:{}
        }
    }

    componentDidMount(){
        let that = this;
        let equipment = getEquipment();
        if(window.em){
            if(equipment.isEMobile){
                window.em.checkJsApi("getNavColor") && window.em.getNavColor({
                    success:function(res){
                        that.setState({
                            emData:res
                        })
                    }
                })
            }else{
                let res = {};
                if(equipment.isiOS == true){
                    Object.assign(res,{
                        clientType:'iPhone',
                        barColor:"F39419C",
                        titleColor:"FFFFFFF",
                        itemColor:"FFFFFFF",
                        errCode: "0" ,
                    })
                }else{
                    Object.assign(res,{
                        clientType:'android',
                        barColor:"FF39419C",
                        titleColor:"FFFFFFFF",
                        itemColor:"FFFFFFFF",
                        errCode: "0" ,
                    })
                }
                this.setState({
                    emData:res
                })
            }
            
        }

    }

    render() {

        return (
            <Provider {...fnaAllStore} {...{emData:this.state.emData}}>
                <Router>
                    <FloatingTouch onClick={() => this.onHomePageClick()}>
                        <Route name="main" path="/" render={() => {
                            return (
                                <coms.Main>
                                    <Switch>
                                        <Redirect exact path="/" to={{pathname: '/home'}} />
                                        <Route name="home(/:type)" breadcrumbName='首页' path="/home" component={coms.Home} />
                                        <Route name='apply' breadcrumbName='申请' path='/apply/:pending' component={coms.Apply} />
                                        <Route name='statistical' breadcrumbName='统计' path='/statistical' component={coms.Statistical} />
                                        <Route name='application' breadcrumbName='应用' path='/application' component={coms.Application} />

                                        {/* 首页 跳转 */}
                                        <Route name='remember' breadcrumbName='记一笔' path='/remember' component={coms.Remember} />
                                        <Route name='rememberDetailPage' breadcrumbName='费用类型详细页面' path='/rememberDetailPage' component={coms.RememberDetailPage} />
                                        <Route name='reception' breadcrumbName='发票录入' path='/reception' component={coms.Reception} />
                                        <Route name='accountBook' breadcrumbName='记账本' path='/accountBook' component={coms.AccountBook} />
                                        <Route name='wallet' breadcrumbName='我的票夹' path='/wallet' component={coms.Wallet} />
                                        <Route name='toWallet' breadcrumbName='添加附件跳转我的票夹' path='/toWallet' component={coms.ToWallet} />
                                        <Route name='toWallet' breadcrumbName='添加附件跳转我的票夹' path='/toWalletCloud' component={coms.ToWalletCloud} />

                                        <Route name='ocr' breadcrumbName='影像自动识别' path='/ocr' component={coms.Ocr} />
                                        <Route name='addApplication' breadcrumbName='三方设置' path='/addApplication' component={coms.AddApplication} />
                                        <Route name='invoiceAssistant' breadcrumbName='开票助手' path='/invoiceAssistant' component={coms.InvoiceAssistant} />
                                        <Route name='incoiceDetails' breadcrumbName='发票详情' path='/detailPage' component={coms.DetailPage} />
                                        <Route name='toDetailPage' breadcrumbName='流程跳转发票详情' path='/toDetailPage' component={coms.ToDetailPage} />
                                    </Switch> 
                                </coms.Main>
                            )
                        }} />
                    </FloatingTouch>
                </Router>
            </Provider>
        )
    }

    onHomePageClick() {
        window.location.href = '/#/';
    }
}

Tools.getLocaleLabel("fna", () => { // 多语言
    FastClick.attach(document.body);
    ReactDOM.render(<Root />, document.getElementById('root'));
});
